<template>
    <section>
        <div class="comment-container">
            <img src="static/images/default-head.png"/>
            <div>
                <p>木子李</p>
                <p class="twoellipsis">快来评论下这些视频吧快来评论下这些视频吧快来评论下这些视频吧快来评论下这些视频吧快来评论下这些视频吧快来评论下这些视频吧快来评论下这些视频吧</p>
            </div>
        </div>
    </section>
</template>
<script>
export default {
    name: 'Comment'
}
</script>
<style lang="scss" scoped>
$main-size: 0.8rem;  
.comment-container{
    width: 100%;
    background: #fff;
    margin-bottom: 0.5rem;
    overflow: hidden;
    img{
        display: inline-block;
        width: $main-size;
        height: $main-size;
        border-radius: $main-size;
        margin-right: 0.2rem;
    }
    div{
        display: inline-block;
        font-size: 0.3rem;
        float: right;
        width: calc(100% - 1rem);
        p:nth-child(1){
            color: #333;
        }
        p:nth-child(2){
            color: #666;
        }
    }
}
</style>
